body{
    background: #f4f4f4;
}  
#sy-nav{        
    width: 100%; 
    height: 1.02rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
        border: 1px solid #ebebeb;
    background: white;
    div{  
        width: 7.19rem;         
        height: .74rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        img{
            width: 2.16rem;
            height: .7rem;
        }
        .p{
            width: 1.4rem;
            height: 0.36rem;
            font-size: 0.35rem;
            overflow: hidden;
            margin-left: -.91rem;
            overflow: hidden;
        }
        div{
            width: 1.3rem;
            height: .79rem;
            font-size: 0;
            a:nth-child(1){
                width: 0.46rem;
                height: 0.68rem;
                display: flex;
                justify-content: space-between;
                flex-direction: column;
                i{
                    width: 0.42rem;   
                    height: 0.45rem;
                     img{
                        width: 100%;
                        height: 100%;
                    }
                }
                p{
                    width: 100%;
                    height: .22rem;
                    overflow: hidden;
                    font-size: 0.22rem;
            overflow: hidden;
                    color: #999;
                }
            }
            a:nth-child(2){
                width: 0.46rem;
                height: 0.68rem;
                display: flex;
                justify-content: space-between;
                flex-direction: column;
                i{
                    width: 0.42rem;
                    height: 0.45rem;
                     img{
                        width: 100%;
                        height: 100%;
                    }
                }  
                p{
                    width: 100%;
                    height: .22rem;
                    overflow: hidden;
                    font-size: 0.22rem;
            overflow: hidden;
                    color: #999;
                }
            }
        }
    }    
}  

#sy-img{
    width: 100%;
    height: 2.38rem;
    img{
        width: 100%;
        height: 100%;
    }
}
#sy-jgg{
    width: 100%;
    height: 4.63rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
   div{
       width: 6.38rem;
       height: 3.87rem;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;   
        a{
            width: 1.2rem;  
            height: 1.73rem;
            display: flex;    
            flex-direction: column;
            justify-content: space-between;
            padding-left: 0.3rem;
            img{
                width: 90%;
                height: 1.2rem;
            }
            p{
                width: 100%;
                height: 0.28rem;
                font-size: 0.28rem;
                color: #333;
                overflow: hidden;
            }
        }
   }
}
#sy-content{
    width: 100%;
    height: 6.52rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    margin-top: .17rem;;
    div{  
        width: 7.12rem;
        height: 5.85rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        li{
            display: flex;
            align-items: center;
        }
        .c-li1{
            width:5.73rem;
            height: 0.43rem;
            overflow: hidden;
            font-size: 0.36rem;
            border-left: 5px #39c894  solid;
            display: flex;     
            align-items: center;
            justify-content: space-evenly;
            p{
                font-size: 0.24rem;
                color: #999;
//              margin-left: 0.3rem;
            }
        }
        .content-li2{
            width: 100%;
            height: 4.02rem; 
            img{
                width: 100%;
                height: 100%;
            }
        }
        
        .content-li2{
            width: 100%;
            height: 4.02rem; 
            img{
                width: 100%;
                height: 100%;
            }
        }
        .div{ 
            width: 100%;
            height: 1.1rem;
            display: flex;
            align-items: center;
            flex-direction: row;
            justify-content: space-between;
             .conten-div-li1{
                width: 2.63rem; 
                height: 100%;
                overflow: hidden;
                display: flex;
                justify-content: space-between;
                .conten-div-li1-p1{
                    width:0.36rem;
                    height: 0.36rem;
                    font-size: 0;
                    img{
                        width: 100%;
                        height: 100%;
                    }    
                }
                .conten-div-li1-p2{
                    width: 2.2rem;
                    font-size: 0.28rem;
                }
            }
             .conten-div-li2{
                width: 2.12rem; 
                height: 100%;
                overflow: hidden;
                display: flex;
                justify-content: space-between;
                .conten-div-li1-p1{
                    width:0.36rem;
                    height: 0.36rem;
                    font-size: 0;
                    img{
                        width: 100%;
                        height: 100%;
                    }    
                }     
                .conten-div-li1-p2{
                    width: 1.68rem;
                    font-size: 0.28rem;
                }
            }
             .conten-div-li3{
                width: 1.57rem; 
                height: 100%;
                overflow: hidden;
                display: flex;
                justify-content: space-between;
                .conten-div-li1-p1{
                    width:0.35rem;
                    height: 0.35rem;
                    font-size: 0;
                    img{    
                        width: 100%;
                        height: 100%;
                    }    
                }
                .conten-div-li1-p2{
                    width: 1.15rem;
                    font-size: 0.28rem;
                }
            }
        }
    }
}
#sy-content1{
    width: 100%;
    height: 5.09rem;
    background: white;
    margin-top: .2rem;
        padding-top: 0.3rem;
        .c-li2{
            width:5.73rem;
            height: 0.43rem;
            overflow: hidden;
            margin-left: .18rem;   
            font-size: 0.36rem;
            border-left: 5px #39c894  solid;
            display: flex;     
            align-items: center;
            justify-content: space-evenly;
            p{
                font-size: 0.24rem;
                color: #999;
//              margin-left: 0.3rem;
            }
        }
    input{
        width: 5.84rem;
        height: 0.6rem;
        border-radius: 10px;
        border: 1px solid #eaeaea;
        background: white;
        font-size: 0.27rem;
         margin-left: 0.8rem;
         padding-left: .18rem;
         color: #eaeaea;
         direction: none;
         outline: none;  
         &::-webkit-input-placeholder{
             font-size: .27rem;
             color: skyblue;
         }
    }
   a{
         width: 5.84rem;
        height: 0.7rem;
        border-radius: 10px;
        color: white;
        font-size: 0.35rem;
        background: #feb605;
        text-align: center;
        display: block;
        margin-top: .26rem;
        line-height: 0.7rem;
         margin-left: 0.8rem;
    }
}
#sy-content2{
    width: 100%;
    height: 4.98rem;
    background: white;
    margin-top: 0.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    div{
        width: 7.17rem;
        height: 4.32rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        .pp{
          width:1.5rem;  
            height: 0.43rem;
            overflow: hidden;
            font-size: 0.36rem;
            border-left: 5px #39c894  solid;
            display: flex;
            justify-content: space-evenly;
      }
      div:nth-child(2){
          width: 100%;
          height: 2.44rem;
          display: flex;
          justify-content: space-around;
          flex-direction: row;
          li{
              width: 1.41rem;
              height: 2.43rem;
              display: flex;
              justify-content: space-between;
              align-items: center;
              flex-direction: column;
              img{   
                  width: 100%;
                  height: 1.42rem;
              }
              p:nth-child(2){
                  font-size: 0.36rem;    
              }
              p:nth-child(3){  
                  width: 1.2rem;
                  height: 0.32rem;
                  background: #39C894;
                  font-size: 0.24rem;
                  text-align: center;
                  line-height: 0.32rem;
                  border-radius: 5px;
                  color: white;
              }
          }
      }
      div:nth-child(3){
          width: 100%;
          height: 0.7rem;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          border-radius: 5px;
          a{
              border: 1px solid #eaeaea;
              width: 50%;
              height: 100%;
              text-align: center;
              line-height: 0.7rem;
              font-size: 0.25rem;
          } 
      }
    }
}

#sy-content3{
    width: 100%;
    height: 12.61rem;
    background: white;
    margin-top: 0.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    div{
        width: 7.17rem;
        height: 11.96rem;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        .pp1{
          width:1.5rem;  
            height: 0.43rem;
            overflow: hidden;
            font-size: 0.36rem;
            border-left: 5px #39c894  solid;
             display: flex;
            justify-content: space-evenly;
      }
      li{
        width: 100%;    
        height: 5.05rem;
        img{       
            width: 100%;
            height: 5.04rem;
        }
    }
      div:nth-child(3){
          width: 7.17rem;
          height: 5.07rem;
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap;
           
              img{   
                  width: 3.55rem;
                  height: 2.51rem;
            
          }   
      }
      div:nth-child(4){
          width: 100%;
          height: 0.7rem;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          border-radius: 5px;
          a{
              border: 1px solid;
              width: 50%;
              height: 100%;
              text-align: center;
              line-height: 0.7rem;
              font-size: 0.25rem;
              color: #398;
          } 
      }
    }
}


#sy-content4{
    width: 100%;
    height: 8.31rem;
    background: white;
    margin-top: 0.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    div{
        width: 7.17rem;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .pp2{
          width:1.95rem;    
            height: 0.43rem;
            overflow: hidden;
            font-size: 0.36rem;
            border-left: 5px #39c894  solid;
           display: flex;
            justify-content: space-evenly;
           
      }
      li{
        width: 100%;    
        height: 5.34rem;
        img{       
            width: 100%;
            height: 100%;
        }
    }
      .pp3{
          width: 100%;
          height: 0.28rem;
          font-size: 0.28rem;
          span{
              width: 1.15rem;
              height: 100%;
              background: #39C894;
              border-radius: 10px;
              margin-left: .3rem;
              color: white;
          }
      }
      div{
          width: 100%;
          height: 0.7rem;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          border-radius: 5px;
          a{
              border: 1px solid;
              width: 50%;
              height: 100%;
              text-align: center;
              line-height: 0.7rem;
              font-size: 0.25rem;
              color: #398;
          } 
      }
    }
}
#sy-content5{
    width: 100%;
    height: 8.31rem;
    background: white;
    margin-top: 0.2rem;
    font-size: 0;
    display: flex;
    justify-content: space-around;
    div{
        width: 7.17rem;
        height: 100%; 
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .pp4{
          width:1.95rem;    
            height: 0.43rem;
            overflow: hidden;
            font-size: 0.36rem;
            border-left: 5px #39c894  solid;
           display: flex;
            justify-content: space-evenly;
           margin-top: .05rem;
      }
      div:nth-child(2){
          width: 100%;
          height:1.5rem;
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          img{
              width: 1.9rem;
              height: 1.45rem;
          }
          div{
              width: 4.9rem;
              height: 1.45rem;
              display: flex;
              flex-direction: column;
              p{
                  width: 5.1rem;
                  height: 0.36rem;
                  font-size: .36rem; 
              }
              li{  
                  width: 3.79rem;
                  height: .33rem;
//                overflow: hidden;
                   display: flex;
                   justify-content: space-between;
                  p:nth-child(1){
                      font-size: .28rem;
                      img{
                          width: 0.31rem;
                          height: 0.29rem;
                      }
                  }
                   p:nth-child(2){
                  width: 1.39srem;
                  height: 100%;
                   font-size: .28rem;
                      img{
                          width: 0.31rem;
                          height: 0.29rem;
                      }
              }
              }
          }
      }
      div:nth-child(3){
          width: 100%;
          height: 1.5rem;
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          align-items: center;
          img{  
              width: 1.9rem;
              height: 1.45rem;
          }
          div{
              width: 4.9rem;
              height: 1.45rem;
              display: flex;
              flex-direction: column;
              p{
                  width: 5.1rem;
                  height: 0.36rem;
                  font-size: .36rem; 
              }
              li{  
                  width: 3.79rem;
                  height: .33rem;
//                overflow: hidden;
                   display: flex;
                   justify-content: space-between;
                  p{
                      font-size: .28rem;
                      img{
                          width: 0.31rem;
                          height: 0.29rem;
                      }
                  }
              }
          }
      }
      div:nth-child(4){
          width: 100%;
          height: 1.5rem;
          display: flex;
          justify-content: space-between;
          flex-direction: row;
          align-items: center;
          img{
              width: 1.9rem;
              height: 1.45rem;
          }
          div{
              width: 4.9rem;
              height: 1.45rem;
              display: flex;
              flex-direction: column;
              p{
                  width: 5.1rem;
                  height: 0.36rem;
                  font-size: .36rem; 
              }
              li{  
                  width: 3.79rem;
                  height: .33rem;
//                overflow: hidden;
                   display: flex;
                   justify-content: space-between;
                  p{
                      font-size: .28rem;
                      img{
                          width: 0.31rem;
                          height: 0.29rem;
                      }
                  }
              }
          }
      }
      
      div:nth-child(5){
          width: 100%;
          height: 0.7rem;  
          display: flex;
          flex-direction: row;
          border-radius: 5px;
          font-size: 0;
          a{
              border: 1px solid;
              width: 50%;
              height: 100%;
              text-align: center;
              line-height:.7rem;
              font-size: 0.25rem;
              color: #398;
          } 
      }
    }
}

#sy-content6{
    width: 100%;
    height: 2.44rem;
    background: white;
    margin-top: 0.2rem;
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;
    p{
        width: 7.03rem;
        height: 0.28rem;
        overflow: hidden;
        font-size: 0.28rem; 
    }
}

#sy-footer{
    width: 100%;
    height: 1.28rem;
    display: flex;
    align-items: center;
    margin-top: 0.2rem;
    flex-direction: column;
    justify-content: space-around;
    background: white;
    div:nth-child(1){
        width: 3.72rem;
        height: 0.33rem;    
        display: flex;
        flex-direction: row;
        margin-top: .18rem;
        img{
            width: 0.32rem;
            height: 0.32rem;
        }
        p{
            font-size: .28rem;
        }
    }
    div:nth-child(2){
        width: 100%;
        height: 0.3rem;
        display: flex;
        justify-content: space-around;
          
            a{
                 overflow: hidden;
            width: 1.17rem;
            height: 100%;
                 font-size: .28rem;
            }
    }
    
}
      
#sy-footer1{
    width: 100%;
    height: 1.06rem;
    background: rgba(0,0,0,0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    div{
        width: 100%;
        height: 100%;
       display: flex;
       align-items: center;
       justify-content: space-around;
       li:nth-child(1){
            width: 0.49rem;
               height: 0.5rem;
               font-size: 0;
           position: absolute;
           top: 0;left: 0;
           img{
               width: 100%;
               height: 100%;
           }
       } 
        li:nth-child(2){
             width: 4.26rem; 
               height: 0.93rem;
               margin-left: 0.8rem;
           img{
               width: 100%;
               height: 100%;
           }
       }
       li:nth-child(3){
           width: 1.75rem;
           height: 0.5rem;
           text-align: center;
           line-height: .5rem;
           color: white;
           font-size: .24rem;
           background: #FEB605;
           border-radius: 10px;
       } 
    }
}
